import Vue from 'vue'
import SvgIcon from '@/components/SvgIcon'// svg component

// 注册全局组件
Vue.component('svg-icon', SvgIcon)

// 手动引入(特别麻烦, 能不能自动导入所有的svg文件呢?)
// import example from './svg/example.svg'
// import example from './svg/example.svg'

// 以下三句代码可以实现把svg文件夹中的所有的svg文件导入项目
/**
 - directory:表示检索的目录
 - useSubdirectories：表示是否检索子文件夹
 - regExp:匹配文件的正则表达式,一般是文件名
 */
const req = require.context('./svg', false, /\.svg$/)
const requireAll = requireContext => requireContext.keys().map(requireContext)
requireAll(req)

// console.log(requireAll(req))

// 自动化导入了所有的svg文件之后, 就可以直接用svg-icon组件去使用所有的svg了吗?
// 不是, 此处还差一个步骤
// 需要通过一个插件(svg-sprite-loader)把 导入的所有的svg文件 去生成一个 svg精灵图
// svg-icon组件才可从精灵图中去根据id取出对应的图标展示
